<template>
<Row class="layout-content-body">
  <dtable :columns="columns" :exportcolumns="exportColumns"   
  :dataAll="dataAll" :dataShow="dataShow" :totals="total" :loading="loading"
  director add delCheck reset check op @refresh="getall()"
  @add="add" @del="del" @edit="edit" @reset="reset" @delCheck="delCheck" @changePage="changePage"
  @director="director"></dtable>
  <Modal title="用户信息" v-model="editData" :mask-closable="false" class="editm" @on-ok="asyncOK" @on-cancel="asyncCancel">
    <Form ref="editForm" :model="formItem" :label-width="80" :rules="ruleValidate">
      <Form-item label="账号" prop="Name">
        <Input v-model="formItem.Name" placeholder="请输入" :disabled="addid" @on-enter="asyncOK()"></Input>
      </Form-item>
      <Form-item label="姓名" prop="Pname">
        <Input v-model="formItem.Pname" placeholder="请输入" @on-enter="asyncOK()"></Input>
      </Form-item>
      <Form-item label="所属单位" prop="Organization">
        <Select v-model="formItem.Organization" disabled placeholder="请选择">
            <Option v-for="item  in org" :value="item.Id" :key="item.Id">{{item.Name}}</Option>
          </Select>
      </Form-item>
      <Form-item label="所属部门" prop="Organization">
        <Select v-model="formItem.DeptId" placeholder="请选择" filterable>
            <Option v-for="item  in dept" :value="item.Id" :key="item.Id">{{item.Name}}</Option>
          </Select>
      </Form-item>
      <Form-item label="角色" prop="RoleId">
        <Select v-model="formItem.RoleId" placeholder="请选择">
            <Option v-for="item  in role" :value="item.Id" :key="item.Id">{{item.Name}}</Option>
          </Select>
      </Form-item>
      <Form-item label="状态" prop="Status">
        <Radio-group v-model.number="formItem.Status">
          <Radio :label="1">启用</Radio>
          <Radio :label="0">停用</Radio>
        </Radio-group>
      </Form-item>
      <Form-item label="说明" prop="Remark">
        <Input v-model="formItem.Remark" type="textarea" :autosize="{minRows: 2,maxRows: 5}" placeholder="请输入...">
        </Input>
      </Form-item>
    </Form>
  </Modal>
  <Modal title="设置检验员" v-model="directorFlag" @on-ok="directorOk">
    <Form>
      <Form-item label="">
         <RadioGroup v-model="directorItem.directorType">
            <Radio v-for="item in directorArray" :label="item.value" :key="item.value">{{item.name}}</Radio>
        </RadioGroup>
      </Form-item>
    </Form>
  </Modal>
</Row>
</template>

<script>
import dtable from '../../components/table/dtable.vue' // 采用biztable
export default {
    data () {
        return {
            loading: false, // 数据刷新遮罩层
            exportColumns: [
                {
                    title: '账号',
                    key: 'Name',
                    sortable: true
                },
                {
                    title: '姓名',
                    key: 'Pname',
                    sortable: true
                },
                {
                    title: '角色',
                    key: 'RoleName',
                    sortable: true
                },
                {
                    title: '所属单位',
                    key: 'OrgName',
                    sortable: true
                },
                {
                    title: '部门',
                    key: 'DeptName',
                    sortable: true
                },
                {
                    title: '状态',
                    key: 'Sname',
                    sortable: true
                }
            ],
            columns: [
        // 多选框
                {
                    title: '账号',
                    key: 'Name',
                    sortable: true
                },
                {
                    title: '姓名',
                    key: 'Pname',
                    sortable: true
                },
                {
                    title: '角色',
                    key: 'RoleName',
                    sortable: true
                },
                {
                    title: '所属单位',
                    key: 'OrgName',
                    sortable: true
                },
                {
                    title: '部门',
                    key: 'DeptName',
                    sortable: true
                },
                // {
                //     title: 'JdType',
                //     key: 'JdType'
                // },
                {
                    title: '状态',
                    key: 'Sname',
                    sortable: true
                }
            ], // 表格样式
            dataAll: [], // 表格数据来源
            dataShow: true, // 是否显示表格数据查看表单
            editData: false, // 显示编辑表单
            formItem: {
                Name: '',
                Pname: '',
                RoleId: 31,
                RoleName: '',
                Organization: '',
                DeptId: '',
                OrgName: '',
                Status: 1,
                Remark: ''
            }, // 数据编辑表单
            ruleValidate: {
                Name: [
                    {
                        required: true,
                        message: '账号不能为空',
                        trigger: 'blur'
                    }
                ],
                Pname: [
                    {
                        required: true,
                        message: '名称不能为空',
                        trigger: 'blur'
                    }
                ],
                RoleId: [
                    {
                        required: true,
                        message: '角色不能为空',
                        trigger: 'change'
                    }
                ]
            }, // 数据编辑表单验证规则
            addid: true, // true为修改模式，false为添加模式
            role: [],
            org: [],
            dept: [],
            total: 0,
            directorFlag: false,
            directorItem: {
                directorType: 0
            },
            directorArray: [
                {
                    name: '痕迹',
                    value: 0
                },
                {
                    name: '法医',
                    value: 1
                },
                {
                    name: 'DNA',
                    value: 2
                },
                {
                    name: '理化',
                    value: 3
                },
                {
                    name: '文检',
                    value: 4
                },
                {
                    name: '电子物证',
                    value: 5
                }
            ],
            directorTmp: {}
        }
    },
    components: {
        dtable
    },
    computed: {
        state () {
            return this.$store.state.app
        }
    },
    watch: {},
    methods: {
        dataFilter (data) {
            if (Array.isArray(data)) {
                return data.map(v => {
                    return v
                })
            }
            return data
        },
    //     获取资源名称
        getNameById (value) {
            let rname = ''
            if (value || '') {
                let rv = this.dataAll.filter((col, index) => col.Id === value)
                rname = rv[0].Name
            }
            return rname
        },
        director (row) {
            console.log(row)
            if (row.length != 1) {
                this.$Message.error('请选择一行！')
                return
            }
            this.directorTmp = row[0]
            this.directorFlag = true
            this.directorItem.directorType = this.directorTmp.JdType
        },
        directorOk () {
      // console.log(this.directorTmp)
            this.directorTmp.JdType = this.directorItem.directorType
            this.$api.updateUser(this.directorTmp).then(
        res => {
            if (!res.error) {
                this.getall()
                this.directorItem.directorType = 0
                this.$Message.success(res.message)
            } else {
                this.$Message.error(res.message, 4)
            }
        },
        err => {
            this.$Message.error(err, 4)
        }
      )
        },
    //      改变页码
        changePage (pagedata) {
            console.log('page changed!')
            this.loading = true
            this.$api.GetAllOrgUsers(pagedata).then(res => {
                if (!res.error) {
                    this.total = res.Data.total
                    this.dataAll = res.Data.tabledata
                } else {
                    this.$Message.error(res.message)
                }
            })
            setTimeout(() => {
                this.loading = false
            }, 500)
        },
        getall () {
            this.loading = true
            this.$api.GetUsersByRole().then(
        res => {
            if (!res.error) {
                // console.log(res.Data)
                this.dataAll = res.Data
                this.total = res.Data.length
            } else {
                this.$Message.error(res.message)
            }
        },
        error => {
            if (error) {
                this.$Message.error(error, 4)
            }
        }
      )
            setTimeout(() => {
                this.loading = false
            }, 500)
        },
        getOrganization () {
            this.$api.getOrganizationList().then(
        res => {
            if (!res.error) {
                this.org = res.Data
            } else {
                this.$Message.error(res.message)
            }
        },
        err => {
            this.$Message.error(res.message, 4)
        }
      )
        },
        getDept () {
            this.spinShow = true
            this.$api.GetDept().then(
        res => {
            if (!res.error) {
                this.dept = res.Data.tabledata
            } else {
                this.$Message.error(res.message)
            }
        },
        err => {
            this.$Message.error(res.message, 4)
        }
      )
        },
        getRole () {
            this.spinShow = true
            this.$api.GetOrgRoleList().then(
        res => {
            if (!res.error) {
                this.role = res.Data
            } else {
                this.$Message.error(res.message)
            }
        },
        err => {
            this.$Message.error(res.message, 4)
        }
      )
        },
        edit (index) {
            this.addid = true
            this.formItem = index
            this.editData = true
        },
        add () {
            this.addid = false
            this.$refs['editForm'].resetFields()
            this.formItem.Organization = this.state.userInfo.Organization.Id
            this.formItem.DeptId = this.state.userInfo.Dept[0].Id
            this.formItem.RoleId = ''
            this.editData = true
        },
        asyncOK () {
            this.$refs['editForm'].validate(valid => {
                if (valid) {
                    if (this.addid) {
                        this.$api.updateUser(this.formItem).then(
              res => {
                  if (!res.error) {
                      this.getall()
                      this.$Message.success(res.message)
                  } else {
                      this.$Message.error(res.message, 4)
                  }
              },
              err => {
                  this.$Message.error(res.message, 4)
              }
            )
                    } else if (!this.addid) {
                        this.$api.addUser(this.formItem).then(
              res => {
                  if (!res.error) {
                      this.getall()
                      this.$Message.success(res.message)
                  } else {
                      this.$Message.error(res.message, 4)
                  }
              },
              err => {
                  this.$Message.error(res.message, 4)
              }
            )
                    }
                    setTimeout(() => {
                        this.editData = false
                    }, 1000)
                } else {
                    this.$Message.error('表单验证失败!')
                }
            })
            this.editData = false
            this.$refs['editForm'].resetFields()
        },
        asyncCancel () {
            this.getall()
            this.$refs['editForm'].resetFields()
        },
        del (row) {
            this.$api.deleteUser(row).then(
        res => {
            if (!res.error) {
                this.getall()
                this.$Message.success(res.message)
            } else {
                this.$Message.error(res.message, 4)
            }
        },
        err => {
            this.$Message.error(res.message, 4)
        }
      )
        },
        delCheck (row) {
            this.$api.deleteUsers(row).then(
        res => {
            if (!res.error) {
                this.getall()
                this.$Message.success(res.message)
            } else {
                this.$Message.error(res.message, 4)
            }
        },
        err => {
            this.$Message.error(res.message, 4)
        }
      )
        },
        reset (row) {
            this.$api.ResetPwd(row).then(
        res => {
            if (!res.error) {
                this.getall()
                this.$Message.success(res.message)
            } else {
                this.$Message.error(res.message, 4)
            }
        },
        err => {
            this.$Message.error(res.message, 4)
        }
      )
        }
    },
    mounted () {
        let self = this
        self.getall()
        self.getOrganization()
        self.getRole()
        self.getDept()
    }
}
</script>
